@function tovmin($rpx) {
  //$rpx为需要转换的字号
  @return #{$rpx * 100 / 750}vmin;
}
.ChatRoom_box {
  max-width: tovmin(468);
  padding: tovmin(12) tovmin(24);
  background: #ffffff;
  border-radius: tovmin(24);
  font-size: tovmin(28);
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #313233;
  line-height: tovmin(40);
  margin-top: tovmin(20);
  display: inline-block;

  .chatRoom_propfile {
    width: tovmin(48);
    height: tovmin(48);
    margin-right: tovmin(12);
    border-radius: 50%;
    display: inline-block;
    vertical-align: bottom;
  }

  .teacherTag_box {
    padding: tovmin(4) tovmin(12);
    background: #1677ff;
    border-radius: tovmin(16);
    font-size: tovmin(24);
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 600;
    color: #ffffff;
    line-height: 1;
    text-align: center;
    display: inline-block;
    margin-right: tovmin(12);
    vertical-align: middle;
  }

  .meTag_box {
    padding: tovmin(4) tovmin(12);
    vertical-align: middle;
    background: #eeeeee;
    border-radius: tovmin(16);
    font-size: tovmin(24);
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 600;
    color: #313233;
    line-height: 1;
    text-align: center;
    display: inline-block;
    margin-right: tovmin(12);
  }

  .otherTag_box {
    font-size: tovmin(28);
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #999b9f;
    margin-right: tovmin(8);
  }
}

.ChatRoom_drop {
  max-width: tovmin(468);
  padding: tovmin(12) tovmin(24);
  background: rgba(232, 232, 232, 255);
  color: rgba(121, 121, 121, 255);
  border-radius: tovmin(8);
  font-size: tovmin(28);
  line-height: tovmin(40);
  margin-top: tovmin(8);
}

.ChatRoom_user_Box {
  font-size: tovmin(28);
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #1677ff;
  background: #e7f1ff;
  border-radius: tovmin(24);
  display: inline-block;
  margin-top: tovmin(20);
  padding: tovmin(12) tovmin(20);

  .UserText_tag_box {
    padding-right: tovmin(12);
  }
}

.ChatShopCard_box {
  width: tovmin(468);
  height: tovmin(180);
  background: #ffffff;
  border-radius: tovmin(24);
  margin-top: tovmin(20);

  .ChatShopCard_body {
    padding: tovmin(24) tovmin(20) tovmin(18);
    display: flex;
    align-items: center;
    justify-content: space-between;

    .ChatShopCard_profile {
      width: tovmin(160);
      height: tovmin(90);
      background: #f2f2f2;
      border-radius: tovmin(16);
    }

    .ChatShopCard_content {
      margin-left: tovmin(16);
      flex: 1;

      .ChatShopCard_content_title {
        font-size: tovmin(30);
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 600;
        color: #313233;
        line-height: tovmin(42);
      }

      .ChatShopCard_content_time {
        margin-top: tovmin(2);
        font-size: tovmin(24);
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #999b9f;
        line-height: tovmin(34);
      }

      .ChatShopCard_card_price {
        margin-top: tovmin(12);
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;

        .ChatShopCard_card_priceLeft {
          display: flex;
          align-items: flex-start;
          font-size: tovmin(32);
          font-weight: 600;
          color: #ff4901;
        }

        .ChatShopCard_card_priceLeft::before {
          font-size: tovmin(24);
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 600;
          color: #ff4901;
          padding-top: tovmin(8);
          content: "￥";
          padding-right: tovmin(4);
        }

        .ChatShopCard_card_priceRight {
          width: tovmin(112);
          height: tovmin(48);
          background: #1677ff;
          border-radius: tovmin(26);
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: tovmin(24);
          font-weight: 600;
          color: #ffffff;
        }
      }
    }
  }
}

.ChatRoom_renderStyle_box {
  background: rgba(0, 0, 0, 0.3) !important;
  color: #ffffff !important;

  .otherTag_box {
    color: rgba(197, 221, 255, 1) !important;
  }

  .meTag_box {
    background: rgba(0, 0, 0, 0.4) !important;
    color: #ffffff !important;
  }
}

.chatRoom_hp {
  // .ChatRoom_box {
  //   max-width: tovmin(234);
  //   padding: tovmin(6) tovmin(12);
  //   background: #ffffff;
  //   border-radius: tovmin(12);
  //   font-size: tovmin(14);
  //   font-family: PingFangSC-Regular, PingFang SC;
  //   font-weight: 400;
  //   color: #313233;
  //   line-height: tovmin(20);
  //   margin-top: tovmin(10);
  //   display: inline-block;

  //   .chatRoom_propfile {
  //     width: tovmin(24);
  //     height: tovmin(24);
  //     margin-right: tovmin(6);
  //     border-radius: 50%;
  //     display: inline-block;
  //     vertical-align: bottom;
  //   }

  //   .teacherTag_box {
  //     padding: tovmin(2) tovmin(6);
  //     background: #1677ff;
  //     border-radius: tovmin(8);
  //     font-size: tovmin(12);
  //     font-family: PingFangSC-Medium, PingFang SC;
  //     font-weight: 600;
  //     color: #ffffff;
  //     line-height: 1;
  //     text-align: center;
  //     display: inline-block;
  //     margin-right: tovmin(6);
  //     vertical-align: middle;
  //   }

  //   .meTag_box {
  //     padding: tovmin(2) tovmin(6);
  //     vertical-align: middle;
  //     background: #eeeeee;
  //     border-radius: tovmin(8);
  //     font-size: tovmin(12);
  //     font-family: PingFangSC-Medium, PingFang SC;
  //     font-weight: 600;
  //     color: #313233;
  //     line-height: 1;
  //     text-align: center;
  //     display: inline-block;
  //     margin-right: tovmin(6);
  //   }

  //   .otherTag_box {
  //     font-size: tovmin(14);
  //     font-family: PingFangSC-Regular, PingFang SC;
  //     font-weight: 400;
  //     color: #999b9f;
  //     margin-right: tovmin(4);
  //   }
  // }

  // .ChatRoom_drop {
  //   max-width: tovmin(234);
  //   padding: tovmin(6) tovmin(12);
  //   background: rgba(232, 232, 232, 255);
  //   color: rgba(121, 121, 121, 255);
  //   border-radius: tovmin(4);
  //   font-size: tovmin(14);
  //   line-height: tovmin(20);
  //   margin-top: tovmin(4);
  // }

  // .ChatRoom_user_Box {
  //   font-size: tovmin(14);
  //   font-family: PingFangSC-Regular, PingFang SC;
  //   font-weight: 400;
  //   color: #1677ff;
  //   background: #e7f1ff;
  //   border-radius: tovmin(12);
  //   display: inline-block;
  //   margin-top: tovmin(10);
  //   padding: tovmin(6) tovmin(10);

  //   .UserText_tag_box {
  //     padding-right: tovmin(6);
  //   }
  // }

  // .ChatShopCard_box {
  //   width: tovmin(221);
  //   height: tovmin(80);
  //   background: #ffffff;
  //   border-radius: tovmin(12);
  //   margin-top: tovmin(10);

  //   .ChatShopCard_body {
  //     padding: tovmin(12) tovmin(10) tovmin(9);
  //     display: flex;
  //     align-items: center;
  //     justify-content: space-between;

  //     .ChatShopCard_profile {
  //       width: tovmin(80);
  //       height: tovmin(45);
  //       background: #f2f2f2;
  //       border-radius: tovmin(8);
  //     }

  //     .ChatShopCard_content {
  //       margin-left: tovmin(8);
  //       flex: 1;

  //       .ChatShopCard_content_title {
  //         font-size: tovmin(15);
  //         font-family: PingFangSC-Medium, PingFang SC;
  //         font-weight: 600;
  //         color: #313233;
  //         line-height: tovmin(21);
  //       }

  //       .ChatShopCard_content_time {
  //         margin-top: tovmin(1);
  //         font-size: tovmin(12);
  //         font-family: PingFangSC-Regular, PingFang SC;
  //         font-weight: 400;
  //         color: #999b9f;
  //         line-height: tovmin(17);
  //       }

  //       .ChatShopCard_card_price {
  //         margin-top: tovmin(6);
  //         display: flex;
  //         align-items: center;
  //         justify-content: space-between;
  //         width: 100%;

  //         .ChatShopCard_card_priceLeft {
  //           display: flex;
  //           align-items: flex-start;
  //           font-size: tovmin(16);
  //           font-weight: 600;
  //           color: #ff4901;
  //         }

  //         .ChatShopCard_card_priceLeft::before {
  //           font-size: tovmin(12);
  //           font-family: PingFangSC-Medium, PingFang SC;
  //           font-weight: 600;
  //           color: #ff4901;
  //           padding-top: tovmin(4);
  //           content: "￥";
  //           padding-right: tovmin(2);
  //         }

  //         .ChatShopCard_card_priceRight {
  //           width: tovmin(56);
  //           height: tovmin(24);
  //           background: #1677ff;
  //           border-radius: tovmin(13);
  //           display: flex;
  //           align-items: center;
  //           justify-content: center;
  //           font-size: tovmin(12);
  //           font-weight: 600;
  //           color: #ffffff;
  //         }
  //       }
  //     }
  //   }
  // }
}
